<template>
    <div class="Zky_Alert" v-if="prop.hidden" :class="type">
        <slot class="FontSize_word">{{ title }}</slot>
    </div>
</template>

<script setup lang="ts">
import { ref, watch } from "vue"
const prop = defineProps({
    hidden: {
        //控制弹窗显示
        type: Boolean,

    },
    title: {
        //控制弹窗显示
        type: String,

    },
    type: {
        //控制弹窗显示
        type: String,

    },
})

// const emit = defineEmits(["update:hidden"])
// watch(() => prop.hidden, () => {
//     HiddenFlag()
// })
// const HiddenFlag = () => {
//     console.log(1);

//     // 控制弹窗消失
//     if (prop.hidden) {
//         let timer = null
//         setTimeout(() => {
//             emit("update:hidden", false)
//         }, 3000)
//     }
// }
// HiddenFlag()

</script>

<style scoped lang="scss">
.Zky_Alert {
    width: 80%;
    margin: 0 auto;
    text-align: left;
    padding: 10px;
    border-radius: 4px;

}

.error {
    background: rgb(255, 0, 0, .4);
}

.success {
    background: rgba(17, 0, 255, 0.4);
}
</style>